/* your custom css */

@media only screen and (min-device-width: 360px) and (max-device-width: 736px) {
}

@media only screen and (min-width: 1024px) {
}

@media only screen and (max-width: 1023px) {
}

@media only screen and (min-width: 1400px) {
}

@media only screen and (min-width: 1500px) {
}

body .hljs {
  display: block;
  overflow-x: auto;
  padding: 0.75rem 1rem;
  background: #f6f6f6;
  border-left: 2px solid #d0d4c7;
  color: black;
}

blockquote {
  padding: .75rem 1.25rem .75rem .75rem;
  border-left: .5rem solid #ffe564
}

.mainContainer a {
  color: $linkColor;
  text-decoration: underline;
}

.mainContainer a:hover {
  color: $actionColor;
}

.projectTitle {
  font-size: 200%;
  color: rgba(255, 255, 255, 0.7);
}

.projectTitle .projectName {
  display: block;
  margin-top: 10px;
}

.projectTitle img {
  width: 100%;
  height: 18vh;
  display: block;
  margin: 0 auto;
  position: relative;
  left: 15px;
}

.projectTitle small {
  text-transform: uppercase;
  letter-spacing: 3px;
  font-weight: 100;
  line-height: 1.9rem;
}

.homeSplashFade {
  min-height: 35vh;
  background: linear-gradient(#121020, #34004B);
  text-align: center;
  color: white;
  position: relative;
  overflow: hidden;
}

.homeSplashFade .button:hover {
  background-color: #7F4898;
}

.homeSplashFade .button {
  color: white;
  display: inline-block;
  padding: 7px 20px;
  border-radius: 6px;
  margin: 0 10px;
  border: 1px solid white;
}

footer.nav-footer {
  box-shadow: none;
  background: #121020;
  font-size: 15px;
}

input#search_input_react {
  background-color: #5D5262;
}

.headerTitleWithLogo {
  font-weight: normal;
}

.trademark-notice {
  margin-top: 10px;
  color: rgba(255, 255, 255, 0.7);
  font-size: .8rem;
}